<%-- 
    Document   : home
    Created on : Mar 27, 2013, 5:48:05 PM
    Author     : Shaun McCready
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">

<html>
   <head>

<title>Home</title>

<link rel="stylesheet" href="css/style.css" type="text/css" media="screen" />

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.hoverpulse.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	$('#nav li').hover(function () {
		$(this).find('.dropDown').slideToggle(200);
		$(this).toggleClass('active');
    });

    $('div.thumb img').hoverpulse().each(function() {
    	var $img = $(this);
    	var link = $img.attr('data-link');
    	$img.attr('title','View More Details ');
    	$img.click(function() {
    		window.open(link,"_self");
    		return false;
    	});
    });
});
</script>

</head>

<body>

<div class="wrapper">

<div id="navContainer">
    <ul class="clear" id="nav">
        <li class="first"><a class="active selected" href="home.jsp">Home</a></li>
        <li><a href="camera.jsp">Products</a>
            <div class="dropDown">
                <div class="top"></div>
                <div class="items">
                    <ul>
                        <li class="first"><a href="camera.jsp">Cameras</a></li>
                        <li><a href="dvd.jsp">DVD Players</a></li>
                        <li class="last"><a href="tv.jsp">Televisions</a></li>
                    </ul>
                </div>
            </div>
        </li>
        <li><a href="order.jsp">Order</a></li>
        <li><a href="payment.jsp">Payment</a></li>
        <li class="last"><a href="logout">Logout</a></li>
    </ul>
</div>
<div class="shoppingcart" style="position:absolute; top:11px; right:25%; margin-right:0px;">
    <%
    String cart1 = request.getSession().getAttribute("cart").toString();
    int cart = Integer.parseInt(cart1);
    %>
    <img src="images/cart.png" width="30" height="30" />
    
    <span style="padding:0; color:silver;">Items: <%=cart%></span>

</div>
</div>


<div id="mainContent">
<h1>Welcome user!</h1>

<p>Thank you for choosing Company X for your electronic goods. Feel free to browse our catalog of electronics which includes a large selection of Cameras, DVD Players and TVs. You can purchase by selecting the item in the Products section or by creating a new order in the Order section.</p><p>For Payments, you will be directed to the payments section through the Order section or you can click on the Payment tab. There you will be able to pay for orders or modify current orders.</p>
<h1>Product Catalog</h1>

<center><table>
       <tr><td><div class="thumb"><img src="images/d1.jpg" width="200" height="150" data-link="dvd.jsp" /></div></td>
            <td><div class="thumb"><img src="images/d2.jpg" width="200" height="150" data-link="dvd.jsp" /></div></td>
            <td><div class="thumb"><img src="images/d3.jpg" width="200" height="150" data-link="dvd.jsp"  /></div></td></tr>
            <tr><td><div class="thumb"><img src="images/c1.jpg" width="200" height="150" data-link="camera.jsp" /></div></td>
            <td><div class="thumb"><img src="images/c2.png" width="200" height="150" data-link="camera.jsp" /></div></td>
            <td><div class="thumb"><img src="images/c3.jpg" width="200" height="150" data-link="camera.jsp" /></div></td></tr>
            <tr><td><div class="thumb"><img src="images/tv1.jpg" width="200" height="150" data-link="tv.jsp" /></div></td>
            <td><div class="thumb"><img src="images/tv2.gif" width="200" height="150" data-link="tv.jsp" /></div></td>
            <td><div class="thumb"><img src="images/tv3.jpg" width="200" height="150" data-link="tv.jsp" /></div></td></tr>
			</table>
</center>
</div>
<div id="footer"><center> <a href="home.jsp">Home</a> | <a href="camera.jsp">Products</a> | <a href="order.jsp">Order</a> | <a href=
      "payment.jsp">Payment</a> | <a href="logout">Logout</a><br />
      Copyright 2013 by Company X. All Rights Reserved.</center></div>

</body>
</html>
